{% extends "base.html" %}
{% block head %}
{{ super() }}
<link rel="stylesheet" href="{{ url_for('static', filename='css/create_user.css') }}">
{% endblock %}
{% block content %}
<div class="container">
    <div class="row">
        <div class="col-md-4 col-md-offset-4">
            <form method="POST" action="/create_user" class="create-user-form">
                {{ form.hidden_tag() }}
                <h2 style="color: white">Create user</h2>

                <div class="form-group
                    {% if form.username.errors %} has-error {% endif %}">
                    {{ form.username.label }} {{ form.username(class="form-control") }}
                    {% if form.username.errors %}
                        <div class="alert alert-danger">
                            {% for error in form.username.errors %}
                                <p>{{ error }}</p>
                            {% endfor %}
                        </div>
                    {% endif %}
                </div>
               
                <div class="form-group {% if form.password.errors %} has-error {% endif %}">
                    {{ form.password.label }} {{ form.password(class="form-control") }}
                    {% if form.password.errors %}
                        <div class="alert alert-danger">
                            {% for error in form.password.errors %}
                                <p>{{ error }}</p>
                            {% endfor %}
                        </div>
                    {% endif %}
                </div>
                <div class="form-group {% if form.confirm_password.errors %} has-error {% endif %}">
                    {{ form.confirm_password.label }} {{ form.confirm_password(class="form-control") }}
                    {% if form.confirm_password.errors %}
                        <div class="alert alert-danger">
                            {% for error in form.confirm_password.errors %}
                                <p>{{ error }}</p>
                            {% endfor %}
                        </div>
                    {% endif %}
                </div>
                <div class="form-group {% if form.role.errors %} has-error {% endif %}">
                    {{ form.role.label }} {{ form.role(class="form-control") }}
                    {% if form.role.errors %}
                        <div class="alert alert-danger">
                            {% for error in form.role.errors %}
                                <p>{{ error }}</p>
                            {% endfor %}
                        </div>
                    {% endif %}
                </div>
                <button type="submit" class="btn btn-primary">Submit</button>
            </form>
        </div>
    </div>
</div>
{% endblock %}
                    